const $siteList = $('.siteList');
const $lastLi = $siteList.find('li.last');
const x = localStorage.getItem('x');
const xObject = JSON.parse(x) //把字符串转换对象
//const xObject = null
const hashMap = xObject || [{
        'logo': "A",
        'url': 'https://acfun.cn'
    },
    {
        'logo': "B",
        'url': 'https://bilibili.com'
    },
    {
        'logo': "Z",
        'url': 'https://zhihu.com'
    }
]
const simplifyUrl = (url) => {
    return url.replace('https://', '')
        .replace('http://', '')
        .replace('www.', '')
        .replace(/\/.*/, '') //删除/后面的内容
}
const render = () => {
    $siteList.find('li:not(.last)').remove();
    hashMap.forEach((node, index) => {
        const $li = $(`
        <li>
            <div class="site">
                <div class="logo">
                    ${node.logo}
                </div> 
                <div class="link">${simplifyUrl(node.url)}</div> 
                <div class="closed">
                    <svg class="icon">
                        <use xlink: href="#icon-closed"></use> 
                    </svg>
                </div>
            </div> 
        </li>
    `).insertBefore($lastLi);
        $li.on('click', () => {
            window.open(node.url)
        })
        $li.on('click', '.closed', (e) => {
            e.stopPropagation();
            hashMap.splice(index, 1);
            render();
        })
    })
}

render();
$('.addButton').on('click', () => {
    let url = window.prompt("请问你要添加的网址是啥？")
    if (url.indexOf('http') !== 0) {
        url = "https://" + url
    }
    hashMap.push({
        'logo': simplifyUrl(url)[0].toUpperCase(),
        "url": url
    })
    $siteList.find('li:not(.last)').remove();
    render();
})

//关闭页面之前触发 
window.onbeforeunload = () => {
    const string = JSON.stringify(hashMap) //把对象变成字符串
    localStorage.setItem('x', string)
}

$(document).on('keypress', (e) => {
    console.log(e);
    const {
        key
    } = e;
    for (let i = 0; i < hashMap.length; i++) {
        if (hashMap[i].logo.toLowerCase() === key) {
            window.open(hashMap[i].url)
        }

    }
})